<template>
  <div>
    <!-- <h1>这是首页页面展示的数字{{count}}</h1>
    <button @click="add">给count的数字加1</button>&nbsp;
    <button @click="addPlus">计算加加</button> -->
    <TypeNav></TypeNav>
    <ListContainer></ListContainer>
    <TodayRecommend></TodayRecommend>
    <Rank></Rank>
    <Like></Like>
    <!-- Home父组件：通过v-for遍历生成索格Floor组件 -->
    <Floor v-for="(floor,index) in floorList" :key="floor.id" :floorInfo="floor"></Floor>
    <Brand></Brand>
  </div>
</template>

<script>
import ListContainer from './ListContainer'
import TodayRecommend from './TodayRecommend'
import Rank from './Rank'
import Like from './Like'
import Floor from './Floor'
import Brand from './Brand'
//引入辅助函数
import {mapState} from 'vuex'
export default {
  name :'Home',
  components:{
    ListContainer,
      TodayRecommend,
      Rank,
      Like,
      Floor,
      Brand,
  },
//Home组件的挂载完毕，声明周期函数，通过VueX发请求函数，获取Floor组件数据
mounted(){
    this.$store.dispatch('getFloorList');
},
//计算属性
computed: {
    ...mapState({
        floorList:state=>state.home.floorList
    })
}
}
</script>

<style>
</style>